<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="layui/css/layui.css" rel="stylesheet">
</head>
<body>
<div style="padding: 20px;" id="app">
    <form>
        <div class="layui-form-item">
            <select class="form-control" v-model="sheetid" style="width: 100%;height: 50px">
                <option value=""> 请选择歌单</option>
                <option v-for="sheet in sheetlist" :value="sheet.id"> {{sheet.name}}</option>
            </select>
        </div>

        <div class="layui-form-item">
            <a class="layui-btn" lay-submit  @click="add()">提交</a>
        </div>

    </form>
</div>
</body>
<script type="text/javascript" src="axios/vue.js"></script>
<script type="text/javascript" src="axios/axios.min.js"></script>
<script type="text/javascript" src="axios/qs.js"></script>
<script type="text/javascript" src="axios/getUrlParams.js"></script>
<script type="text/javascript" src="layer/layer.js"></script>
<script type="text/javascript" src="layui/layui.js"></script>
<script type="text/javascript">
    var qs = Qs
    var movieid = UrlParam.paramValues("movieid").toString()
    var vmm = new Vue({
        el: '#app',
        data: {
            sheetlist:[],
            sheetid:'',
            collect:{
                id:''
            }
        },
        mounted() {
            this.getsheetlist()
            layui.use(['form', 'layer', 'upload'], function () {
                    $ = layui.jquery;
                    var form = layui.form
                        , layer = layui.layer
                        , upload = layui.upload;
            })
        },
        methods: {
            getsheetlist(){
                axios.post('sheetList',qs.stringify({
                })).then(response =>{
                    this.sheetlist = response.data.list
            }).catch(error =>{
                    console.log(error)
            })
            },

            add(){
                if (this.sheetid == "") {
                    layer.msg("请选择歌单", {icon: 5})
                    return false;
                }

                axios.post('collectAdd', qs.stringify({
                    sheetid: this.sheetid,
                    movieid:movieid,
                })).then(response => {
                    if(response.data.data==200)
                {
                    layer.alert("操作成功！", {icon: 6}, function () {
                        var index = parent.layer.getFrameIndex(window.name);
                        parent.layer.close(index)
                        parent.vmm.getaddresslist()
                    })
                }else{
                    layer.msg("该歌曲已存在于该歌单！",{icon:5})
                }

                }).catch(error => {
                    console.log(error)
                })
            },


        }
    });
</script>
</html>